<template>
  <q-toolbar class="map-top-bar bg-white-6 row full-width q-gutter-x-sm">
    <template v-if="modelValue === 'preview'">
      <div v-if="openedMap.mapGroundCode" class="row items-center text-body1 text-bold">
        <q-icon class="map-icon-color" name="mdi-map-marker-multiple-outline on-left" size="1.5rem"></q-icon>
        <span>{{ openedMap.mapName }}</span>
      </div>
      <q-space></q-space>
    </template>

  </q-toolbar>

</template>

<script setup>
import { getRemoteData } from 'src/enum/ajaxRemoteData.js'

import { ref, watch } from 'vue'

const props = defineProps({ openedMap: { type: Object, default: () => ({}) }, modelValue: String })

const AGVBrands = ref([])
const currentJson = ref('')
getRemoteData('agv_brand', '/yfagv/api/agvCfgBrand/list').then(data => (AGVBrands.value = data))


watch(() => props.openedMap?.mapGroundCode, () => currentJson.value = '')



</script>

<style lang="scss" scoped>
.map-icon-color {
  color: rgb(32, 76, 202);
}
</style>